<template>
  <div>
    <div class="test-div__card">

    </div>

    <div class="test-div__card">
      <el-table
        :data="state.tableData"
        border
        stripe
      >
        <el-table-column
          :label="$t('app1.user.userRoleList.table.name')"
          prop="name"
          sortable
        ></el-table-column>
        <el-table-column
          :label="$t('app1.user.userRoleList.table.remarks')"
          prop="remarks"
        ></el-table-column>
        <el-table-column :label="$t('app1.user.userRoleList.table.operation')">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script setup>
import { reactive } from 'vue'
import Mock from 'mockjs'

const mock = Mock.mock({
  'data|10': [
    {
      id: '@guid',
      name: '@cname',
      remarks: '@ctitle'
    }
  ]
})

const state = reactive({
  tableData: mock.data
})
</script>